<template>
	<view v-show="types" class="pages">
		<u-subsection  :list="list"  :current="current" @change="sectionChange"></u-subsection>
		<view v-if="current==0">
			<view class="nav1">临时货主：{{uinfo.hzdwid}}</view>
			<view class="nav1">临时车队：{{cdinfo.cdname}}</view>
			<view class="buts" v-if="addcdtype==true" @click="addcdinfo">创建授权车队</view>
			<view class="buts" @click="addsjtype=true">增加司机</view>
			<view class="buts" @click="getsjtype=true">查看司机信息</view>
		</view>
		<view v-if="current==1">
			<view class="nav1">临时货主：{{uinfo.hzdwid}}</view>
			<view class="nav1">临时车队：{{cdinfo.cdname}}</view>
			<view class="buts" @click="addjgcp=true">添加进港车辆</view>
			<view class="buts" @click="getjgcp=true">查看车辆信息</view>
			<view class="buts" @click="getshlist()">审核历史</view>
		</view>
		
		<!-- 司机增加二维码 -->
		<u-popup :show="addsjtype" mode="center" :closeable="true" round="5" @close="addsjtype=false" @open="addsjtype=true">
			<view class="butsj">
				<view class="erimg"><image :src="imgsrc"></image></view>
			</view>
		</u-popup>
		<!-- 司机信息查询 -->
		<u-popup :show="getsjtype" mode="center" :closeable="true" round="5" @close="getsjtype=false" @open="getsjtype=true">
			<view class="tcsj">
				<view class="tto">司机信息</view>
				<view class="fm">
					<view class="fm1">姓名:</view>
					<view class="fm1" style="width: 200px;"><u--input v-model="userInfo.name" fontSize="20px"  placeholder="请输入姓名"  border="bottom"></u--input></view>
					<view class="fm1" @click="getcdsjlist">查询</view>
					<view class="fm1" style="margin-left: 8px;" @click="delsj()">删除</view>
				</view>
				<view class="tm">
					<view class="tm1" v-if="sjlist.length>0">
						<view class="tm2" v-for="(item,index) in sjlist" :key="index" @click="sjxz(item)" :class="xzid == item.id ? 'active':''">
							<view class="tm2ts">姓名:{{item.cname}}</view>
							<view class="tm2ts">手机号:{{item.phone}}</view>
						</view>
					</view>
					
					<view class="tm1" v-if="sjlist.length==0">
						<view class="tm2">
							<view class="tm2ts">暂无司机数据</view>
						</view>
					</view>
				</view>
				
				
			</view>
		</u-popup>
		
		<!-- 增加进港车辆 -->
		<u-popup :show="addjgcp" mode="center" :closeable="true" round="5" @close="addjgcp=false" @open="addjgcp=true">
			<view class="tcsj" style="height: 400px;">
				<view class="tto">增加进港车辆</view>
				<view class="fm">
					<view class="fm1">车牌号:</view>
					<view class="fm1" style="width: 200px;"><u--input v-model="cpinfo.cp" fontSize="20px"  placeholder="请输入车牌号"  border="bottom"></u--input></view>
				</view>
				<view class="ft">
					如港内作业车辆,可不提交车辆信息 点击下一步, 提交审核(上传文件格式: 图片)
				</view>
				<view class="fms">
					<view class="fm1s">证件</view>
					<view class="fm1s">状态</view>
					<view class="fm1s">操作</view>
				</view>
				<view class="fms">
					<view class="fm2s">行驶证上传</view>
					<view class="fm2s" @click="chooseImage(1)">{{cpinfo.xszurl==''?'未上传':'上传成功'}}</view>
					<view class="fm2s" @click="ckzj(1)">查看</view>
				</view>
				<view class="fms">
					<view class="fm2s">运营证上传</view>
					<view class="fm2s" @click="chooseImage(2)">{{cpinfo.yyzurl==''?'未上传':'上传成功'}}</view>
					<view class="fm2s" @click="ckzj(2)">查看</view>
				</view>
				<view class="fms">
					<view class="fm2s">其他上传</view>
					<view class="fm2s" @click="chooseImage(3)">{{cpinfo.qturl==''?'未上传':'上传成功'}}</view>
					<view class="fm2s" @click="ckzj(3)">查看</view>
				</view>
				<view class="fms">
					<view class="fm2s"><u-button type="primary" @click="sh" text="确定"></u-button></view>
					<!-- <view class="fm2s"><u-button type="success" @click="xyb" text="下一步"></u-button></view> -->
					<view class="fm2s"><u-button type="error" @click="addjgcp=false"  text="取消"></u-button></view>
				</view>
			</view>
		</u-popup>
		<!-- 查询车辆信息 -->
		<u-popup :show="getjgcp" mode="center" :closeable="true" round="5" @close="getjgcp=false" @open="getjgcp=true">
			<view class="tcsj">
				<view class="tto">车辆信息</view>
				<view class="fm">
					<view class="fm1">车牌:</view>
					<view class="fm1" style="width: 200px;"><u--input v-model="cpcx.name" fontSize="20px"  placeholder="请输入车牌"  border="bottom"></u--input></view>
					<view class="fm1" @click="getcdinfocplist">查询</view>
					<view class="fm1" style="margin-left: 8px;" @click="getcpdel()">删除</view>
				</view>
				<view class="tm">
					<view class="tm1" v-if="cllist.length>0">
						<view class="tm2" v-for="(item,index) in cllist" :key="index" @click="csjxz(item)" :class="cxzid == item.id ? 'active':''">
							<view class="tm2ts">车牌:{{item.char1}}</view>
							<view class="tm2ts">洗车次数:{{item.xcnum}}</view>
						</view>
					</view>
					<view class="tm1" v-if="cllist.length==0">
						<view class="tm2">
							<view class="tm2ts">暂无车辆数据</view>
						</view>
					</view>
				</view>
				
				
			</view>
		</u-popup>
		<u-popup :show="ckzjtype" :zIndex="30075" mode="center" :closeable="true" round="5" @close="ckzjtype=false" @open="ckzjtype=true">
		<view class="butsj">
			<view class="erimg"><image :src="zjimages"></image></view>
		</view>
		</u-popup>
		<u-popup :show="getshcp" mode="center" :closeable="true" round="5" @close="getshcp=false" @open="getshcp=true">
			<view class="tcsj">
				<view class="tto">车牌审核</view>
				<view class="tm">
					<view class="tm1" v-if="cllist.length>0">
						<view class="tm2" v-for="(item,index) in shlist" :key="index"  :class="cxzid == item.id ? 'active':''">
							<view class="tm2ts">车牌:{{item.cp}}</view>
							<view class="tm2ts">货主:{{item.hzname}}</view>
							<view class="tm2ts">车队:{{item.cdname}}</view>
							<view class="tm2ts" @click="ckimg(item.xszurl)">驾驶证：查看详情</view>
							<view class="tm2ts" @click="ckimg(item.yyzurl)">行驶证：查看详情</view>
							<view class="tm2ts" @click="ckimg(item.qturl)">其他：查看详情</view>
							<view class="tm2ts">审核时间:{{item.times}}</view>
							<view class="tm2ts">状态:{{item.status==1?'待审核':item.status==2?'通过':'驳回'}}</view>
							<view class="tm2ts" v-if="item.status==3">拒绝理由:{{item.bz}}</view>
						</view>
					</view>
					<view class="tm1" v-if="shlist.length==0">
						<view class="tm2">
							<view class="tm2ts">暂无审核信息</view>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		
	
		<!-- 信息提示 -->
		<u-notify ref="uNotify" message="Hi uView"></u-notify>
	</view>
</template>
<script>
	import {
	  request
	} from '@/util/request.js'
	export default {
		name:"newhz",
		props: {
			types: {
				type: Boolean,
				default: false,
				required: true,
			},
			uid:{
				type: Number,
				default: 0,
			}
		},
		data() {
			return {
				list: ['司机信息', '车辆信息'],
				current: 0,
				uinfo:'',
				addcdtype:false,
				addsjtype:false,
				getsjtype:false,
				getjgcp:false,
				addjgcp:false,
				ckzjtype:false,
				getshcp:false,
				zjimages:'',
				cdid:'',
				cdinfo:'',
				imgsrc:'',
				userInfo:{
					name:'',
					cdid:''
				},
				cpinfo:{
					cp:'',
					xszurl:'',
					yyzurl:'',
					qturl:'',
					cdid:'',
					uid:''
				},
				cpcx:{
					name:'',
					cdid:''
				},
				sjlist:[],
				cllist:[],
				shlist:[],
				xzuid:'',
				xzid:'',
				xzinfo:null,
				cxzid:'',
				cxzinfo:null,
			};
		},
		created(){
				this.getuserinfo(); 
		},
		methods: {
			ckimg(e){
				this.zjimages = e
				this.ckzjtype = true
			},
			async getshlist(){
				let data = {
					uid:this.uid
				}
				let res = await request('/api/Shy/shlist/', 'post',data)
				this.shlist = res.data.data
				console.log(res.data)
				this.getshcp = true
			},	
			
			
			//司机选中
			sjxz(e){
				this.xzid = e.id
				this.xzinfo = e
			},
			//车辆选中
			csjxz(e){
				this.cxzid = e.id
				this.cxzinfo = e
			},
			async getcpdel(){
				let cxzid = this.cxzid
				if(cxzid==null){
					this.$refs.uNotify.show({
						type: 'primary',
						message: '请选中司机进行操作！',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					return false
				}else{
					let data = {
						id:cxzid
					}
					let res = await request('/api/Linshz/getcpdel/', 'post',data)
					if(res.data.code==200){
						this.$refs.uNotify.show({
							type: 'primary',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
						this.getcdinfocplist()
					}else{
						this.$refs.uNotify.show({
							type: 'error',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}
				}
			},
			async delsj(){
				let xzid = this.xzid
				if(xzid==null){
					this.$refs.uNotify.show({
						type: 'primary',
						message: '请选中司机进行操作！',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					return false
				}else{
					let data = {
						uid:xzid
					}
					let res = await request('/api/Linshz/sjdelcdinfo/', 'post',data)
					if(res.data.code==200){
						this.$refs.uNotify.show({
							type: 'primary',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
						this.getcdsjlist()
					}else{
						this.$refs.uNotify.show({
							type: 'error',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}
				}
			},
			//提交车牌审核
			async sh(){
				let cpinfo = this.cpinfo
					cpinfo.cdid = this.cdid
					cpinfo.uid = this.uid
				if(cpinfo.cp =='' || cpinfo.xszurl=='' || cpinfo.yyzurl=='' ||cpinfo.qturl==''){
					this.$refs.uNotify.show({
						type: 'primary',
						message: '请完善审核信息！',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
				}else{
					let res =  await request('/api/Linshz/addshinfo/', 'post',cpinfo)
					if(res.data.code==200){
						this.$refs.uNotify.show({
							type: 'primary',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
						this.cpinfo = {
							cp:'',
							xszurl:'',
							yyzurl:'',
							qturl:'',
							cdid:'',
							uid:''
						}
						this.addjgcp = false
					}else{
						this.$refs.uNotify.show({
							type: 'error',
							message: res.data.msg,
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}
				}
			},
			async getcdinfocplist(){
				this.cpcx.cdid = this.cdid
				let data = this.cpcx
				let res =  await request('/api/Linshz/getcdinfocplist/', 'post',data)
				if(res.data.code==200){
					this.cllist = res.data.data
				}
			},
			//删除车牌信息
			chooseImage(e){
				uni.chooseImage({
					count: 1, //最多可以选择的图片张数，默认9
					sizeType: ['compressed'], //original 原图，compressed 压缩图，默认二者都有
					sourceType: ['album'], //album 从相册选图，camera 使用相机，默认二者都有。如需直接开相机或直接选相册，请只使用一个选项
					success: (res) => { //成功返回的函数
						console.log('图片路径为：', res.tempFilePaths[0]) //选着的图片
						var imageSrc = res.tempFilePaths[0]
						uni.uploadFile({ //上传图片
							url: 'http://121.62.23.47:100/api/Gindex/updateimg', //开发者服务器 url
							filePath: imageSrc, //要上传文件资源的路径。
							fileType: 'image', //文件类型，image/video/audio
							name: 'file', //文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
							success: (res) => { //接口调用成功的回调函数
								let resdata = JSON.parse(res.data);
								if(resdata.code==200){
									if(e==1){
										this.cpinfo.xszurl = resdata.data
									}
									if(e==2){
										this.cpinfo.yyzurl = resdata.data
									}
									if(e==3){
										this.cpinfo.qturl = resdata.data
									}
								}
								console.log(this.cpinfo)
							}
						
						})
						
					},
				})	
			},
			ckzj(e){
				if(e==1){
					if(this.cpinfo.xszurl==''){
						this.$refs.uNotify.show({
							type: 'primary',
							message: '当前证件未上传',
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}else{
						this.zjimages = this.cpinfo.xszurl
						this.ckzjtype = true
					}
				}
				if(e==2){
					if(this.cpinfo.yyzurl==''){
						this.$refs.uNotify.show({
							type: 'primary',
							message: '当前证件未上传',
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}else{
						this.zjimages = this.cpinfo.yyzurl
						this.ckzjtype = true
					}
				}
				if(e==3){
					if(this.cpinfo.qturl==''){
						this.$refs.uNotify.show({
							type: 'primary',
							message: '当前证件未上传',
							duration: 1000 * 3,
							fontSize: 20,
							safeAreaInsetTop:true
						})
					}else{
						this.zjimages = this.cpinfo.qturl
						this.ckzjtype = true
					}
				}
			},
			sectionChange(index) {
				this.current = index;
			},
			//获取用户信息
			async getuserinfo(){
				let data = {
					id:this.uid
				}
				let res =  await this.$api.getuserinfo(data)
				if(res.data.code==0){
					let data = res.data.data
					this.uinfo = data
					uni.setStorageSync('uid', data.id);
					uni.setStorageSync('cdtype', data.cdtype);	
					if(data.cdtype==6){
						//进行委托单号状态更新
						this.getcdinfo(data.hzdwid);
					}
				}			
			},
			
			
			
			
			//创建临时货主车队信息
			async addcdinfo(){
				let data = {
					hzname:this.uinfo.hzdwid,
					types:2,
					cdid:this.cdid,
					uid:this.uid
				}
				let res =  await request('/api/Linshz/addcdinfo/', 'post',data)
				console.log(res.data);
				if(res.data.code==200){
					this.$refs.uNotify.show({
						type: 'primary',
						message: res.data.msg,
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					this.getcdinfo(this.uinfo.hzdwid);
					this.addcdtype = false
				}else{
					this.$refs.uNotify.show({
						type: 'error',
						message: res.data.msg,
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					this.addcdtype = true
				}
			},
			//获取添加司机二维码
			async getimgs() {
				let data = {
					cdid:this.cdid,
					uid:this.uid
				}
				let res = await this.$api.addsiji(data)
				console.log(res)
				//if(res.data.code==0){
				this.imgsrc = res.data
				//}else{
					//console.log(res)
				//}
			},
			
		
			
			async getcdsjlist(){
				this.userInfo.cdid = this.cdid
				let data = this.userInfo
				let res =  await request('/api/Linshz/getcdsjlist/', 'post',data)
				if(res.data.code==200){
					this.sjlist = res.data.data
				}
			},
			
			
			//获取当前临时货主的授权车队
			async getcdinfo(hzname){
				let data = {
					hzname:hzname,
					types:2,
					uid:this.uid
				}
				let res =  await request('/api/Linshz/getcdinfo/', 'post',data)
				console.log(res.data);
				if(res.data.code==200){
					this.cdinfo = res.data.data.cdinfo
					this.cdid = res.data.data.cdid
					this.addcdtype = false
					this.getcdsjlist();
					this.getimgs();
					this.getcdinfocplist();
				}else{
					this.addcdtype = true
				}
			}
			
			
		},
	}
</script>

<style lang="less" scoped>
	.pages{
		.buts{
			border: 1px solid #3c77b7;
			width: 180px;
			border-radius: 5px;
			text-align: center;
			margin:  0 auto;
			padding-top:10px;
			padding-bottom: 10px;
			color: #3c77b7;
			font-size: 18px;
			margin-top: 10px;
		}
	}
	.nav1{
		height: 50px;
		line-height: 50px;
		padding-left: 10px;
		font-size: 20px;
		// font-weight: 600;
		color: #3c77b7;
	}
	.butsj{
		width: 360px;
		height: 400px;
		.erimg{
			width: 90%;
			height: 300px;
			margin: 0 auto;
			overflow: hidden;
			border: 3px solid #3c77b7;
			border-radius: 10px;
			margin-top: 80upx;
			image{
				height: 100%;
				width: 100%;
			}
		}
	}
	.tcsj{
		width: 360px;
		height: 500px;
		.fm{
			overflow: hidden;
			height: 36px;
			line-height: 36px;
			.fm1{
				float: left;	
				font-size: 20px;
				margin-left: 3px;
			}
		}
		.ft{
			padding: 5px;
			font-size: 17px;
			line-height: 26px;
		}
		.fms{
			overflow: hidden;
			height: 36px;
			line-height: 36px;
			.fm1s{
				float: left;	
				font-size: 20px;
				margin-left: 3px;
				width: 32%;
				text-align: center;
				background-color: #e0e0e0;
			}
			.fm2s{
				float: left;	
				font-size: 20px;
				margin-left: 3px;
				width: 32%;
				text-align: center;
			}
		}
		.tm{
			height: 400px;
			border-top: 1px solid #3c77b7;
			.tm1{
				overflow: auto;
				height: 398px;
				.tm2{
					border: 1px solid #3c77b7;
					border-radius: 5px;
					width: 300px;
					margin: 0 auto;
					margin-top: 10px;
					padding-bottom: 4px;
					padding-top: 4px;
					.tm2ts{
						text-align: center;
						margin-top: 5px;
						font-size: 18px;
					}
				}
			}
			
		}
		.tto{
			background-color: #3c77b7;
			color: #ffffff;
			text-align: center;
			height: 40px;
			line-height: 40px;
			font-size: 20px;
		}
		.active{
			background-color: #3c77b7;
			color: #ffffff;
		}
	}
</style>